@using System.Web.Mvc.Html
@using viBook.Models
@model viBook.Models.Book
@{
   
    var categories = ViewBag.CategoryCollection as IEnumerable<SelectListItem>;
    var imageUrl = string.IsNullOrEmpty(@Model.CoverUrl) ? @Url.Content("~/Images/DefaultbookImage.png") : @Model.CoverUrl;
}
@* This partial view defines form fields that will appear when creating and editing entities *@
<script src="../../Scripts/jquery.autocomplete.min.js" type="text/javascript"></script>
<link href="../../Content/jquery.autocomplete.css" rel="stylesheet" type="text/css" />
<link href="../../Scripts/uploadify/uploadify.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/uploadify/swfobject.js" type="text/javascript"></script>
<script src="../../Scripts/uploadify/jquery.uploadify.v2.1.4.min.js" type="text/javascript"></script>
<div class="span-8">
    <div class="editor-label">
        @Html.LabelFor(model => model.Title)
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.Title)
        @Html.ValidationMessageFor(model => model.Title)
    </div>
    <div  class="editor-label">
        <p>
            Author<br />
            <input type="text" id="AuthorName" name="AuthorName" value="@Model.AuthorName"/></p>
        @Html.ValidationMessageFor(model => model.AuthorName)
    </div>
   
       <div class="editor-label">
        @Html.LabelFor(model => model.Tag)
    </div>
     <div class="editor-field">
        @Html.EditorFor(model => model.Tag)
        @Html.ValidationMessageFor(model => model.Tag)
    
    </div> 
    <div class="editor-label">
        @Html.LabelFor(model => model.HasChapters)
    </div> 
      <div class="editor-field">
        @Html.CheckBoxFor(model => model.HasChapters)
    </div>
    <div class="editor-label">
    <p>Category</p>
    </div>
    <div class="editor-field">
        @Html.DropDownListFor(model => model.CategoryId, categories)
        
    </div>
     <div class="editor-label">
        @Html.LabelFor(model => model.Description)
    </div>
    <div class="editor-field">
        @Html.TextAreaFor(model => model.Description)
        @Html.ValidationMessageFor(model => model.Description)
    </div> 
    
     
   
    <input type="hidden" id="filesUploaded" name="filesUploaded" />
</div>
<div class="span-10">
    <img src="@imageUrl" width="180" height="200" />
    <br />
    <div>
        <input id="file_upload" name="file_upload" type="file" />
    </div>
</div>

<script type="text/javascript">

    $(document).ready(function () {
        $("#AuthorName").autocomplete("/Authors/Search", { minChars: 1 });        
        $("#file_upload").uploadify({
            'uploader': '/Scripts/uploadify/uploadify.swf',
            'script': '@Url.Action("UploadImage")',
            'fileDataName': 'FileData',
            'buttonText': 'Select files',
            'multi': false,
            'width': 120,
            'sizeLimit': 4000000,
            'simUploadLimit': 1,
            'cancelImg': '/Scripts/uploadify/cancel.png',
            'folder': '/Images',
            'fileExt': '*.jpg;*.bmp;*.png;*.gif',
            'auto': true,
            'removeCompleted': false,
            'onError': function (a, b, c, d) {
                if (d.status == 404)
                    alert("Could not find upload script. Use a path relative to: " + "<?= getcwd() ?>");
                else if (d.type === "HTTP")
                    alert("error " + d.type + ": " + d.status);
                else if (d.type === "File Size")
                    alert(c.name + " " + d.type + " Limit: " + Math.round(d.info / (1024 * 1024)) + "MB");
                else
                    alert("error " + d.type + ": " + d.text);
            },
            'onComplete': function (event, queueId, fileObj, response, data) {
                $("#filesUploaded").val(fileObj.filePath);

            }

        });
    });

</script>
